<!DOCTYPE html>
<html>
<head>
    <title>公告详情</title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">

    <meta name="description" content="">

    <link rel="stylesheet" href="dist/lib/weui.css">
    <link rel="stylesheet" href="dist/css/build.css">
    <link rel="stylesheet" href="dist/css/jquery-weui.css">

    <style>
        body {
            /*background: #f5f5f5*/
        }

        .weui-article h1 {
            font-size: 22px;
            line-height: 28px;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 2;
            margin-bottom: 15px;
        }

        .top span {
            color: #417DFF;
        }

        .top span.data {
            padding-left: 15px;
            color: #bbb;
        }

        section {
            padding-top: 15px;
            font-size: 17px;
            color: #333;
            line-height: 30px;
        }
    </style>
</head>

<body>

<div id="list">
    <article class="weui-article" v-for="item in items">
        <div class="top">
            <h1>{{item.title}}</h1>
            <span>{{item.category}}</span><span class="data">{{dateUtils.beautify_time(item.publishDate)}}</span>
        </div>

        <section v-if=" item.photoUrl == null ">

            <p id="c" v-html="item.comment"></p>

        </section>

        <section v-else>
            <img :src="item.photoUrl">
            <p v-html="item.comment"></p>
        </section>
    </article>

</div>

<script src="dist/lib/jquery-2.1.4.js"></script>
<script src="dist/lib/vue.min.js"></script>
<script src="dist/lib/fastclick.js"></script>
<script src="dist/js/jquery-weui.js"></script>
<script src="dist/lib/http.js"></script>
<script src="dist/lib/jquery.cookie.js"></script>
<script>
    $(function () {
        FastClick.attach(document.body);
    });

</script>
<script>

    /**
     * js获取HTML ？后面传值
     */
    function GetRequest() {
        var url = location.search; //获取url中"?"符后的字串
        var theRequest = new Object();
        if (url.indexOf("?") != -1) {
            var str = url.substr(1);
            strs = str.split("&");
            for (var i = 0; i < strs.length; i++) {
                // theRequest[strs[i].split("=")[0]]=unescape(strs[i].split("=")[1]);
                theRequest[strs[i].split("=")[0]] = decodeURI(strs[i].split("=")[1]);
            }
        }
        return theRequest;
    }

    /**
     * js获取HTML ？后面传值 的调用方法
     */
    var Request = new Object();
    Request = GetRequest();
    var id;
    id = Request['id'];

    $(document).attr("title", Request['title']);

    /**
     * 登录信息判断
     */
    $http.getUserSignIn(true, 'notice_details.html', 'id=' + id);
    console.log($http.getUserSignIn());

    /**
     * VUE 模板替换
     */
    var news = new Vue({
        el: '#list',
        data: {
            items: [] //列表信息流数据
        }
    });

    getData(id);

    /**
     * 得到公告详情数据
     * @param id
     */
    function getData(id) {
        $http.post($http.FindByCondition(id)).then(function (data) {
            var myData = {
                id: data['data'][0]['id'],
                title: data['data'][0]['title'],
                photoUrl: data['data'][0]['photoUrl'],
                comment: dateUtils.urll(data['data'][0]['comment']),
                publishDate: data['data'][0]['publishDate'],
                category: data['data'][0]['category'],
            }
            news.items = news.items.concat(myData);

        }, function (err) {
            console.log(err);
            return err;
        });
    }
</script>


</body>
</html>
